<template>
	<view class="box">
		<view class="top">
			<view class="sousuo">
				<text class="cuIcon-search">
					<text class="click" @click="sJump()">点击前往搜索</text>
				</text>
			</view>
		</view>

		<view class="searchBox">

		</view>
		<view class="content">
			<view class="contentLeft">
				<view class="leftBox " v-for="(item,index) in list" :key="index" :class="name==item.name?'action':''"
					@click=listId(item.name,item.id);>
					{{item.name}}
				</view>

			</view>
			<view class="contentRight">
				<view class="banbox">
					<img :src="banner.picUrl" alt="" class="conRbox" lazy="loaded" />
				</view>
				<view class="bantextBox">
					<text class="bannerText">
						{{banner.desc}}
					</text>
				</view>

				<view class="clearfixBox">
					<view class="moreBox" v-for="(item,index) in idList" :key="index" @click='goCategory(item.id)'>
						<img :src="item.picUrl" alt="" class="morImg" />
						<text class="morText">
							{{item.name}}
						</text>
					</view>
				</view>

			</view>
		</view>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				banner: [],
				idList: [],
				list: [],
				name: '居家',
				id: 1005000,

			}
		},
		methods: {
			sJump(){
				uni.navigateTo({
					url:'/pages/search/search'
				})
			},
			getNew() {
				//请求的数据
				uni.request({
					url: 'http://admin.bsmall.byesame.com/wx/catalog/index',
					data: {},
					header: {},
					success: (res) => {
						console.log(res, '请求出来的应用列表'),
							this.list = res.data.data.categoryList
						console.log(this.list)
					}
				})
			},
			getId() {
				uni.request({
					url: 'http://admin.bsmall.byesame.com/wx/catalog/current?id=1005000',
					data: {},
					header: {},
					success: (res) => {
						console.log(res, '请求出来的应用列表'),
							this.idList = res.data.data.currentSubCategory
						this.banner = res.data.data.currentCategory
						console.log(this.idList)
						console.log(this.banner, "banner")


					}
				})
			},
			goCategory(val) {
				uni.navigateTo({
					url: '/pages/category/category?itemClass=' + val
				});
			},


			listId(val, id) {
				this.name = val
				console.log(id, "111")
				this.id = id,
					uni.request({
						url: 'http://admin.bsmall.byesame.com/wx/catalog/current?id=' + id,
						data: {},
						header: {},
						success: (res) => {
							console.log(res, '请求出来的应用列表'),
								this.idList = res.data.data.currentSubCategory
							this.banner = res.data.data.currentCategory
							console.log(this.idList)
							console.log(this.banner, "banner")
						}
					})


			}




		},
		onLoad() {
			this.getNew();
			this.getId();


		}

	}
</script>

<style lang="scss" scoped>
	@import url('msg.css');

	uni-page-body,
	uni-page-refresh {
		display: block;
		box-sizing: border-box;
		width: 100%;
		height: 100%;
	}

	.matop {
		width: 95%;
		margin-left: 10px;
		margin-top: 55px;
	}

	.top {
		display: flex;
		top: -5px;
		width: 100%;
		z-index: 999;
		position: fixed;
		align-items: center;
		justify-content: center;

	}
</style>
